<!-- 点击查看文章信息 -->
<template>
	<div>
		<el-page-header @back="goBack" content="详情页面">
		</el-page-header>
		<!--文章详细信息-->
		<div class="content">
			<h3 style="text-align:center;">{{artInfo.title}}</h3>
			<div class="content_info">
				作者/来源：{{artInfo.author}}
				发表时间：<span v-text="dateFormat(artInfo.operTime)"></span>
				发布人:{{artInfo.nickName}}
			</div>
			<hr />
			
			<el-card style="width: 90%;margin: 20px 50px;" >
			  <div class="markdown-body" v-html="artInfo.content">
			  </div>
			</el-card>
			
		</div>
	</div>
</template>

<script>
	export default {
		data() {
			return {
				artInfo: {
					id: 0,
					title: '',
					author: '',
					content: '',
					operTime: '',
					nickName: ''
				}
			}
		},
		methods: {
			getArticleInfo() {
				let that = this;
				var id = this.$route.query.id;
				this.$http.get("/articleMeg/getArticleInfo?id=" + id).then(function(res) {
					that.artInfo.id = res.data.articleInfo.id;
					that.artInfo.title = res.data.articleInfo.title;
					that.artInfo.author = res.data.articleInfo.author;
					
					var markdownit = require("markdown-it");
					var md = new markdownit();
					var result = md.render(res.data.articleInfo.content);
					
					that.artInfo.content = result;
					that.artInfo.operTime = res.data.articleInfo.operTime;
					that.artInfo.nickName = res.data.articleInfo.nickName;
					
				})
			},
			goBack() {
				this.$router.push("/article");
			},
			dateFormat(time) { //时间格式转换
			  var date = new Date(time);
			  var year = date.getFullYear();
			  /* 在日期格式中，月份是从0开始的，因此要加0
			   * 使用三元表达式在小于10的前面加0，以达到格式统一  如 09:11:05
			   * */
			  var month =
			    date.getMonth() + 1 < 10 ?
			    "0" + (date.getMonth() + 1) :
			    date.getMonth() + 1;
			  var day = date.getDate() < 10 ? "0" + date.getDate() : date.getDate();
			
			  var hour = date.getHours() < 10 ? "0" + date.getHours() : date.getHours();
			  var minute = date.getMinutes() < 10 ? "0" +  date.getMinutes() :  date.getMinutes();
			  var second = date.getSeconds() < 10 ? "0" + date.getSeconds() : date.getSeconds();
			  // 拼接
			  return (
			    year+"-"+month+"-"+day+" "+hour+":"+minute+":"+second
			  );
			},
		},
		created() {
			this.getArticleInfo()()
		}
	}
</script>

<style>
</style>
